<!DOCTYPE html>
<html>

<head>
	<meta charset="utf-8">
	<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
	<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
	<title>{$name}</title>
	<link rel="stylesheet" type="text/css" href="__CSS__/api.css" />
	<link rel="stylesheet" type="text/css" href="__CSS__/aui.css" />
	<style>
		body {
			background-color: #F4F4F4;
			outline: 0;
		}
		.outer{
			background-color: #fff;
		}
		.good{
			margin-left:0.5rem;
			margin-right:0.5rem;
			padding-top:0.55rem;
			padding-bottom: 0.55rem;
		}
		.avatar {
			width: 4.65rem;
			height:4.65rem;
			margin-right: 0.75rem;
		}
		.avatar img {
			width: 100%;
			height: 100%;
		}
		.name {
			font-size: 14px;
			color: #404040;
		}
		.intro{
			font-size: 12px;
			color: #999;
			padding-bottom:0.5rem;
		}
		.price{
			font-size: 15px;
			color: #F04040;
		}
		.jian,
		.jia {
			width: 1rem;
			height: 1rem;
			/*margin-top:0.625rem;*/
		}
		.number {
			padding-left:1.4rem;
			padding-right:1.4rem;
			text-align: center;
			font-size: 14px;
			color: #666;
		}


		.three {
			padding:0 0.5rem;
			background-color: #F4F4F4;
		}

		.one {
			width: 44%;
			height: auto;
			background-color: #fff;
			display: inline-block;
			box-shadow: 0px 1.5px 3px 0px rgba(0, 0, 0, 0.2);
			border-radius: 4px;
			margin-bottom: 0.75rem;
			padding-bottom:0.4rem;
		}

		.one_pic {
			width: 100%;
			height: 8.625rem;
			border-top-left-radius: 4px;
			border-top-right-radius: 4px;
			position: relative;
		}

		.shop_pic {
			width: 100%;
			height: 100%;
			border-top-left-radius: 4px;
			border-top-right-radius: 4px;
		}

		.one:nth-child(2n+1) {
			margin-left: 0.5rem;
			margin-right:0.5rem;
		}

		.intro {
			height: 2.425rem;
			background-color: #fff;
			padding-top: 0.3rem;
			padding-left: 5px;
			padding-right: 5px;
			border-bottom-left-radius: 4px;
			border-bottom-right-radius: 4px;
		}

		.tit {
			font-size: 12px;
			color: #404040;
		}

		.price {
			font-size: 12px;
			color: #F04040;
		}

		.weight {
			text-align: right;
			font-size: 10px;
			color: #999;
		}

		.fast {
			position: absolute;
			top: 0;
			left: 7px;
			width: 2.325rem;
			height: 2.475rem;
		}

		.fast img {
			width: 100%;
			height: 100%;
		}

		.label {
			height: 0.95rem;
			line-height: 0.95rem;
			position: absolute;
			bottom: 0;
			left: 0;
			font-size: 13px;
			color: #fff;
			padding-left: 6.5px;
			padding-right: 6.5px;
			background: linear-gradient(129.2deg, rgba(255, 178, 4, 1), rgba(255, 109, 31, 1));
			border-bottom-right-radius: 1px;
			border-top-right-radius: 1px;
		}
		.jian,
		.jia {
			width: 1rem;
			height: 1rem;
		}

		.number {
			/*padding-left: 1.4rem;
            padding-right: 1.4rem;*/
			font-size: 11px;
			color: #666;
			padding-top: 3px;
		}

		.addCar {
			padding-left: 5px;
			padding-right: 5px;
		}
	</style>
	<style>
		.aui-iconfont {
			position: relative;
			font-family: "aui_iconfont" !important;
			font-size: 0.7rem;
			font-style: normal;
			-webkit-font-smoothing: antialiased;
			-moz-osx-font-smoothing: grayscale;
			height: 2.4rem;
		}

		.aui-icon-tu {
			height: 2.4rem;
			width: 49px;
			background: url('__IMG__/left.png') no-repeat center center;
			background-size: 10px 17.5px;
		}

		.aui-bar-nav .aui-title {
			font-size: 0.9rem;
			color: #333333;
			font-weight: 500;
		}

		.aui-icon-rightu1 {
			height: 2.4rem;
			width: 35px;
			background: url('__IMG__/search.png') no-repeat 0.6rem center;
			background-size: 18px 17px;
		}

		.aui-icon-rightu2 {
			height: 2.4rem;
			width: 45px;
			background: url('__IMG__/car.png') no-repeat 0.6rem center;
			background-size: 17px 17px;
		}

		.navbar {
			width: 100%;
			background-color: #FFFFFF;
		}

		.tab-grid {
			width: 100%;
			height: 2.15rem;
			overflow-x: scroll;
			overflow-y: hidden;
			background-color: white;
			position: relative;
			padding-left: 0.5rem;
		}

		.tab-grid::-webkit-scrollbar {
			height: 0;
		}

		.tab-item {
			float: left;
			height: 2.15rem;
			/*padding-left: 0.375rem;*/
			padding-right: 1rem;
			line-height: 2.25rem;
			text-align: center;
			font-size: 0.75rem;
			color: #666;
			z-index: 10;
		}

		.tab-item-all {
			width: 10000%;
			padding-left: 0.15rem;
		}

		.item_active {
			color: #FF5757;
			font-size: 0.75rem;
			position: relative;
		}
		.item_active:after {
			content: '';
			display: block;
			height: 0px;
			width:60%;
			border-top: 2px solid #F04040;
			bottom: 0px;
			left:0;
			position: absolute;
			border-radius: 2px;
		}
		.bottom {
			height: 1.375rem;
			line-height: 1.375rem;
			color: #999;
			font-size: 0.65rem;
		}

		.xian {
			width: 1px;
			height: 0.75rem;
			margin-top: 0.3rem;
		}
		.up{
			height:1.3rem;
			width: 10px;
			background: url('__IMG__/up.png') no-repeat center center;
			background-size:10px 12px;
			margin-left: 3.5px;
		}
		.down{
			height:1.3rem;
			width: 10px;
			background: url('__IMG__/up_no.png') no-repeat center center;
			background-size:10px 12px;
			margin-left: 3.5px;
		}
	</style>
</head>

<body>
<!--header start-->
<header class="aui-bar aui-bar-nav underLine" id="header">
	<a class="aui-pull-left" tapmode="active" onclick="window.history.back(-1);"> <span class="aui-iconfont aui-icon-tu"> </span>
	</a>
	<!-- <div class="aui-title" id='titleee'></div> -->
	<a class="aui-pull-right">
		<span class="aui-iconfont aui-icon-rightu1" tapmode="active" onclick="sousuo()"></span>
		<span class="aui-iconfont aui-icon-rightu2" tapmode="active" onclick="che()"></span>
	</a>
</header>
<div class="navbar flex-wrap" id="bar">
	<section class="tab-grid">
			{volist name='types' id='t'}
				{if $t.st_id == $type}
				<div class="tab-item item_active" typename="{$t.st_name}" typeid="{$t.st_id}" tapmode onclick="selectOne(this)">
					{$t.st_name}</div>
				{else /}
				<div class="tab-item" typename="{$t.st_name}" typeid="{$t.st_id}" tapmode onclick="selectOne(this)">
					{$t.st_name}</div>
				{/if}
			{/volist}
	</section>
</div>
<div class="flex-wrap bottom" id="bottom" style="background-color: #fff;">
	<div class="flex-con">
		<div class="flex-wrap" onclick="changeType(this)" type='1'>
			<div class="flex-con"></div>
			价格
			<div class="up" id='top1'></div>
			<div class="flex-con"></div>
		</div>
	</div>
	<div class="xian rightLine"></div>
	<div class="flex-con">
		<div class="flex-wrap" onclick="changeType(this)" type='2'>
			<div class="flex-con"></div>
			销量
			<div class="up" id='top2'></div>
			<div class="flex-con"></div>
		</div>
	</div>
</div>
<!--header end-->
{if !$good}
<div class="seat hidden" id="seatAll">
	<img src="__IMG__/quexing/no_content.png" class="seatImg"/>
	<div class="seatName">没有符合条件的内容</div>
</div>
{/if}
<div class="three">
	<div id="list">
		{volist name='good' id='g'}
		<div class="one"  onclick="openOneProduct(this)" g_id="{$g.g_id}">
			<div class="one_pic">
				{if $g.g_prcie_kill >0 }
				<div class="fast"><img src="__IMG__/fast.png" alt=""></div>
				{/if}
				<img src="{$g.g_thumb ?? '__IMG__/zhanweitu/a3.png'}" class="shop_pic" >
			</div>
			<div class="intro">
				<div class="tit aui-ellipsis-1">{$g.g_name}</div>
				<div class="flex-wrap">
					{if $g.g_prcie_kill >0 }
					<div class="price">￥{$g.g_prcie_kill}</div>
					{else /}
					<div class="price">￥{$g.g_price_now}</div>
					{/if}
					<div class="flex-con weight aui-ellipsis-1">{$g.g_weight}</div>
				</div>
			</div>
			<div class="flex-wrap addCar">
				<div class="jian" tapmode onclick="delectOneProductAllPointtt(this)" g_id="{$g.g_id}">
					<img src="__IMG__/jian.png" alt="" />
				</div>
				<div class="number flex-con" id="numberrr_{$g.g_id}">{$g.haveNum}</div>
				<div class="jia" tapmode onclick="addOneProductAllPointtt(this)" g_id="{$g.g_id}">
					<img src="__IMG__/add.png" alt="" />
				</div>
			</div>
		</div>
		{/volist}
	</div>
</div>
</body>
<input type="hidden" id="price" value="1" />
<input type="hidden" id="sales" value="1" />
<input type="hidden" id="sid" value="{$sid}" />
<script type="text/javascript" src="__JS__/jquery.min.js"></script>
<script type="text/javascript" src="__JS__/tt22.js"></script>
<script type="text/javascript">
function changeType(el) {
	var where = $(el).attr('type');
	var pri = $('#price').val();
	var sal = $('#sales').val();
	if(where == 1){
        $('#price').val(2-pri+1);
        if(pri == 1){
            $('#top1').addClass('down');
            $('#top1').removeClass('up');
		}else{
            $('#top1').addClass('up');
            $('#top1').removeClass('down');
		}

	}else{
        $('#sales').val(2-sal+1);
        if(sal == 1){
            $('#top2').addClass('down');
            $('#top2').removeClass('up');
        }else{
            $('#top2').addClass('up');
            $('#top2').removeClass('down');
        }
	}
    ajaxGetList();
	return;
}
function ajaxGetList() {
    var pri = $('#price').val();
    var sal = $('#sales').val();
    var type = {$type};
    var sid = $('#sid').val();
    var parame = {
        price: pri,
        sales: sal,
        type: type,
        s_id: sid,
        ajax:777
    };
    $.ajax({
        url: '{:url("home/Index/shopGoodList")}',
        data: parame,
        type: 'POST',
        dataType: 'json',
        success: function (returndata) {
            if(returndata.msg.length > 0){
                $('#list').empty();
                var datas = returndata.msg;
                $.each(datas,function(key,v){
                    var str = '';
                    var money = v.g_price_now;
                    if(v.g_prcie_kill > 0){
                        str = '<div class="fast"><img src="__IMG__/fast.png" alt=""></div>';
                        money = v.g_prcie_kill;
					}
					if(!v.g_thumb){
                        v.g_thumb = '__IMG__/zhanweitu/a3.png';
					}
                    $("#list").append('<div class="one"  ' +
						'onclick="openOneProduct(this)" g_id="'+v.g_id+'">' +
						'<div class="one_pic">'
						+ str +
						'<img src="'+v.g_thumb+'" class="shop_pic" >' +
					'</div><div class="intro"><div class="tit aui-ellipsis-1">'+v.g_name+'</div>' +
					'<div class="flex-wrap">' +
					'<div class="price">￥'+money+'</div>' +
					'<div class="flex-con weight aui-ellipsis-1">'+v.g_weight+'</div>' +
					'</div></div><div class="flex-wrap addCar">' +
					'<div class="jian" tapmode onclick="delectOneProductAllPointtt(this)" g_id="'+v.g_id+'">' +
					'<img src="__IMG__/jian.png" alt="" /></div>' +
					'<div class="number flex-con" id="numberrr_'+v.g_id+'">'+v.haveNum+'</div>' +
					'<div class="jia" tapmode onclick="addOneProductAllPointtt(this)" g_id="'+v.g_id+'">' +
					'<img src="__IMG__/add.png" alt="" />' +
					'</div></div></div>');
                })
			}
        },
        error: function () {
            alert('Ajax error!');
        }
    })
}
function openOneProduct(el) {
    var gid = $(el).attr('g_id');
    location.href = '{:url("home/Index/shopGoodInfo")}?g_id=' + gid;
}
//列表
function selectOne(el) {
    var tid = $(el).attr('typeid');
    var name = $(el).attr('typename');
    var sid = $('#sid').val();
    location.href = '{:url("home/Index/shopGoodList")}?s_id='+sid+'&type='+tid+'&name='+name;
}
function sousuo() {
    var sid = $('#sid').val();
    location.href = '{:url("Index/goSearch")}?s_id='+sid;
}
function che() {
    var sid = $('#sid').val();
    location.href = '{:url("Car/index")}';
}
</script>

</html>
